import React from 'react'
import useSequentialLoader from '@/utils/hooks/useSequentialLoader'
import { ChatLoadMd } from '../ChatLoadDom'
import ViewReport from './result'
import './index.less'

interface IProps {
    type: ChatFeatureType;
    data: any;
    loading: boolean;
    onRender?: (isForce?: boolean) => void;
}

const ChatRedesignReport: React.FC<Omit<IProps, 'type'>> = ({ data, loading, onRender }) => {
    const loadedComponents = useSequentialLoader([
        {
            component: ChatLoadMd,
            effectKey: 'step1',
        },
        {
            component: ViewReport,
            effectKey: 'step2',
        },
    ], data, {
        onLoad: () => {
            onRender && onRender(true)
        },
        onEnd: () => {
            onRender && onRender(true)
        }
    }, {
        loading: loading,
        autoRender: true
    }, {
        onRender,
    })
    return (
        <div className='chat-redesign-report'>
            {loadedComponents}
        </div>
    )
}

export default ChatRedesignReport
